<template>
    <el-container>
        <el-main>
    <div id="main" style="width: 1800px;height: 600px;"></div>
            </el-main>
        </el-container>
</template>

<script>
    import echarts from 'echarts'
    export default {
        name: 'PaperRead',
        methods:{
            drawPie(id){
                this.charts = echarts.init(document.getElementById(id))
                this.charts.setOption({
                    title: {
                        text: '频道阅读数分析（top5）'
                    },
                    legend: {},
                    tooltip: {},
                    dataset: {
                        source: [
                          ['android', '后端', '人工智能', 'ios', 'python', '数据库'],
                          ['频道阅读数分析（top5）',300010, 100549, 325786, 383414, 935124, 687254]
                        ]
                    },
                    xAxis: {type: 'category'},
                    yAxis: {},
                    series: [
                      {type: 'bar'},
                      {type: 'bar'},
                      {type: 'bar'},
                      {type: 'bar'},
                      {type: 'bar'},
                      {type: 'bar'}
                    ]
                })
            }
        },
        //调用
        mounted(){
            this.$nextTick(function() {
                this.drawPie('main')
            })
        }
    }
</script>

<style scoped>

</style>